<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui">
	
	<p:dialog id="popUpNuevoEstudiante" header="#{i18n['erp.matricula.estudiante.registrar']}" resizable="false" draggable="false"
		widgetVar="dlgNuevoEstudiante" modal="true" width="750" minWidth="750" appendTo="@(body)" closeOnEscape="true">
		
		<h:form id="formNuevoEstudiante" styleClass="formulario">
		
		<p:scrollPanel mode="native" style="height:500px">
		<p:tabView id="pnlNuevoEstudiante">
        <p:tab title="Estudiante">
            <p:panel  header="Información General del Estudiante">
			
				<table class="formulario">
									
					<tr>
						<td colspan="4"><p:graphicImage id="image" height="80" cache="false" value="#{estudianteDataManager.estudiantePersonaInsertar.perFoto}"/></td>
					</tr>
				
					<tr>	
						<td class="label">
							<h:outputLabel for="txtCi" value="Cédula" />
							<h:outputLabel value="#{i18n['label.signo.requerido']}" styleClass="item-required" />
						</td>
						<td class="value">
							<p:inputText id="txtCi" value="#{estudianteDataManager.estudiantePersonaInsertar.perCi}"  maxlength="10"
								required="true" requiredMessage="El campo #{i18n['erp.matricula.estudiante.cedula']} es Obligatorio"
								 label="#{i18n['erp.matricula.estudiante.cedula']}" onkeypress="return isNumberKey(event);">
								<f:validateLength maximum="10" minimum="10"/>
								<f:validator validatorId="ec.edu.uce.erp.web.validador.CedulaValidator" />
								<p:ajax event="blur" listener="#{estudianteController.buscarPersonaEstudiante}" process="@this" update="pnlNuevoEstudiante"></p:ajax>								
							</p:inputText>			
						</td>
						<td class="label">
							<h:outputLabel  value="Género" />
							<h:outputLabel value="#{i18n['label.signo.requerido']}"
								styleClass="item-required" />
						</td>
					<td  class="value"><p:selectOneRadio 
										required="true"
										requiredMessage="El campo Género Estudiante es Obligatorio."
										value="#{estudianteDataManager.estudiantePersonaInsertar.perGenero}">
										<f:selectItem itemLabel="Femenino" itemValue="F" />
										<f:selectItem itemLabel="Masculino" itemValue="M" />
									</p:selectOneRadio></td>
						
					</tr>
						
					
					<tr>
						<td class="label">
							<h:outputLabel for="txtApe" value="Apellidos"  />
							<h:outputLabel value="#{i18n['label.signo.requerido']}"
								styleClass="item-required" />
						</td>
						<td class="value" colspan="3">
							<p:inputText id="txtApe" style="width: 100%"  required="true" requiredMessage="El campo #{i18n['erp.matricula.estudiante.apellidos']} es Obligatorio"
								value="#{estudianteDataManager.estudiantePersonaInsertar.perApellidos}" label="#{i18n['erp.matricula.estudiante.apellidos']}"/>
						</td>
					</tr>
					<tr>
						<td class="label">
							<h:outputLabel for="txtNombres" value="Nombres" />
							<h:outputLabel value="#{i18n['label.signo.requerido']}"
								styleClass="item-required" />
						</td>
						<td class="value" colspan="3">
							<p:inputText id="txtNombres" value="#{estudianteDataManager.estudiantePersonaInsertar.perNombres}"
								style="width: 100%" required="true" label="#{i18n['erp.matricula.estudiante.nombres']}" requiredMessage="El campo #{i18n['erp.matricula.estudiante.nombres']} es Obligatorio." />
						</td>
					</tr>
					
					<tr>
						<td class="label">
							<h:outputLabel for="txtFecNac" value="Fecha Nac." />
							<h:outputLabel value="#{i18n['label.signo.requerido']}"
								styleClass="item-required" />
						</td>
						<td class="value">
							<p:calendar  pattern="dd/MM/yyyy" requiredMessage="El campo #{i18n['erp.matricula.estudiante.fechanac']} es Obligatorio" locale="es" id="txtFecNac" style="width: 100%" navigator="true" value="#{estudianteDataManager.estudiantePersonaInsertar.perFechaNac}"  showOn="button" required="true"/>
						</td>	
					</tr>
					
					
					<tr>
						<td class="label">
							<h:outputLabel for="txtTelefono" value="Teléfono" />
						</td>
						<td class="value">
							<p:inputMask mask="(99) 9999-999" id="txtTelefono" 
								value="#{estudianteDataManager.estudiantePersonaInsertar.perTelefono}" label="#{i18n['erp.matricula.estudiante.direccion']}"></p:inputMask>
						</td>	
						<p:tooltip for="txtTelefono" value="Ejemplo: (02)2222-222" showEffect="slide" hideEffect="slide"
                                                   showEvent="focus" hideEvent="blur"/>
					</tr>
					<tr>
						<td class="label">
							<h:outputLabel for="txtCelular" value="Celular" />
						</td>
						<td class="value">
							<p:inputMask mask="(99) 99999-999" id="txtCelular" 
								value="#{estudianteDataManager.estudiantePersonaInsertar.perCelular}" label="#{i18n['erp.matricula.estudiante.direccion']}"  />
						</td>	
						<p:tooltip for="txtCelular" value=" Ejemplo: (09)99999-999" showEffect="slide" hideEffect="slide"
                                                   showEvent="focus" hideEvent="blur"
                                                   />
					</tr>
					
					<tr>
						<td class="label">
							<h:outputLabel for="txtEmail" value="Email" />
						</td>
						<td class="value" colspan="3">
							<p:inputText id="txtEmail" style="width: 100%"
								 value="#{estudianteDataManager.estudiantePersonaInsertar.perEmail}" label="#{i18n['erp.matricula.estudiante.direccion']}">
								<f:validator validatorId="ec.edu.uce.erp.web.validador.EmailValidator" />
							</p:inputText>
						</td>	
					</tr>
					<tr>
						<td class="label">
							<h:outputLabel value="Adj.Foto" />
						</td>
						<td>
						<table width="50" title="Adjuntar Foto Estudiante">
							<tr>
							<td>
							    <p:fileUpload fileUploadListener="#{estudianteController.handleFileUpload}" mode="advanced" dragDropSupport="true"
                     				 update="image" auto="true" sizeLimit="1000000" allowTypes="/(\.|\/)(gif|jpe?g|png)$/" label="Seleccionar" process="@this"/>
						</td>
						</tr>
						</table>
						</td>
					</tr>
					<tr>
						<td class="label">
							<h:outputLabel for="txtLugHermano" value="Posición entre los Hermanos" />
							
						</td>
						<td class="value">
							<p:inputText id="txtLugHermano" style="width: 100%" 
								value="#{estudianteDataManager.estudiantePersonaInsertar.perLugarOcupa}"  />
						</td>
						
					</tr>
					<tr>
					<td class="label">
							<h:outputLabel for="txtTieneHermanos" value="Cuantos Hermanos tiene" />
							
						</td>
						<td class="value">
							<p:inputText id="txtTieneHermanos" style="width: 100%" 
								value="#{estudianteDataManager.estudiantePersonaInsertar.perCuantosHermanos}"  
								onkeypress="return isNumberKey(event);"/>
						</td>	
					</tr>
					<tr>
					<td colspan="4"><h3>Dirección Domicilio</h3></td>
					</tr>
					
					<tr>
						<td class="label">
							<h:outputLabel for="txtCallePrin" value="Calle Principal" />
							
						</td>
						<td class="value">
							<p:inputText id="txtCallePrin" style="width: 100%" 
								value="#{estudianteDataManager.estudiantePersonaInsertar.perCallePrincipal}"  />
						</td>	
						<td class="label">
							<h:outputLabel for="txtViviendaEs" value="La Vivienda es" />
							
						</td>
						<td class="value">
							<p:inputText id="txtViviendaEs" style="width: 100%" 
								value="#{estudianteDataManager.estudiantePersonaInsertar.perViviendaEs}"  />
						</td>	
						
					</tr>
					
					<tr>
						<td class="label">
							<h:outputLabel for="txtCalleSec" value="Calle Secundaria" />
							
						</td>
						<td class="value">
							<p:inputText id="txtCalleSec" style="width: 100%" 
								value="#{estudianteDataManager.estudiantePersonaInsertar.perCalleSecundaria}"  />
						</td>
						<td class="label">
							<h:outputLabel for="txtNumeroVivienda" value="N° de Vivienda" />
							
						</td>
						<td class="value">
							<p:inputText id="txtNumeroVivienda" style="width: 100%" 
								value="#{estudianteDataManager.estudiantePersonaInsertar.perNumeroVivienda}"  />
						</td>	
					</tr>
					
					
					<tr>
					<td colspan="4"><h3>Información Médica</h3></td>
					</tr>
					<tr>
						<td class="label">
							<h:outputLabel  value="Alergias o Intolerancia a Med." />
							
						</td>
						<td  class="value"><p:selectOneMenu
										value="#{estudianteDataManager.estudiantePersonaInsertar.perAlergias}">
										<f:selectItem itemLabel="SI" itemValue="S" />
										<f:selectItem itemLabel="NO" itemValue="N" />
									</p:selectOneMenu></td>
						<td class="label">
							<h:outputLabel  value="N° Historia Clinica" />
							
						</td>
						<td class="value">
							<p:inputText style="width: 100%" 
								value="#{estudianteDataManager.estudiantePersonaInsertar.perNumeHistClinica}"  />
						</td>				
						
					</tr>
					
					<tr>
						<td class="label">
							<h:outputLabel  value="Discapacidad" />
							
						</td>
						<td  class="value"><p:selectOneMenu
										value="#{estudianteDataManager.estudiantePersonaInsertar.perPresentaDificultad}">
										<f:selectItem itemLabel="SI" itemValue="S" />
										<f:selectItem itemLabel="NO" itemValue="N" />
									</p:selectOneMenu></td>
									
							
						
					</tr>
					<tr>
						<td class="label">
							<h:outputLabel value="Toma algún medicamento" />
							
						</td>
						<td class="value">
							<p:inputText style="width: 100%" 
								value="#{estudianteDataManager.estudiantePersonaInsertar.perDesMed}"  />
						</td>
						
					</tr>
										</table>
				</p:panel>
        </p:tab>
        <p:tab title="Padre">
            <p:panel id="pnlPadre" header="Información del Padre">
            <table class="formulario">
							<tr>
								<td class="label"><h:outputText for="txtCiPadre"
										value="Cédula" />
									<h:outputLabel value="#{i18n['label.signo.requerido']}" styleClass="item-required" />	
								</td>
								<td class="value"><p:inputText id="txtCiPadre"
										style="width:100px" onkeypress="return isNumberKey(event);"
										maxlength="10" required="true" requiredMessage="El campo Cédula del Padre es Obligatorio."
										value="#{estudianteDataManager.padreInsertar.perCi}">
										<f:validator
											validatorId="ec.edu.uce.erp.web.validador.CedulaValidator" />
										<p:ajax event="blur" update="pnlPadre"
											listener="#{estudianteController.buscarPadre}"
											process="@this" />
									</p:inputText></td>
							</tr>

							<tr>
								<td class="label"><h:outputLabel for="txtApePadre"
										value="Apellidos" />
								<h:outputLabel value="#{i18n['label.signo.requerido']}" styleClass="item-required" />		
								</td>
								<td class="value"><p:inputText id="txtApePadre"
										style="width: 100%" required="true" requiredMessage="El campo Apellidos del Padre es Obligatorio."
										value="#{estudianteDataManager.padreInsertar.perApellidos}" />
								</td>
							</tr>

							<tr>
								<td class="label"><h:outputLabel for="txtNomPadre"
										value="Nombres" />
								<h:outputLabel value="#{i18n['label.signo.requerido']}" styleClass="item-required" />		
								</td>
								<td class="value"><p:inputText id="txtNomPadre"
										style="width: 100%" required="true" requiredMessage="El campo Nombres del Padre es Obligatorio."
										value="#{estudianteDataManager.padreInsertar.perNombres}" />
								</td>
							</tr>
							<tr>
								<td class="label"><h:outputLabel for="txtFecNacPadre" title="Fecha Nacimiento"
										value="Fecha Nac." /> <h:outputLabel
										value="#{i18n['label.signo.requerido']}"
										styleClass="item-required" /></td>
								<td class="value"><p:calendar pattern="dd/MM/yyyy"
										requiredMessage="El campo Fecha Nacimiento de la Padre es Obligatorio"
										locale="es" id="txtFecNacPadre" style="width: 100%"
										navigator="true"
										value="#{estudianteDataManager.padreInsertar.perFechaNac}"
										showOn="button" required="true" /></td>
							</tr>
							<tr>
								<td class="label"><h:outputLabel for="txtTelefonoPadre"
										value="Teléfono" /></td>
								<td class="value"><p:inputMask mask="(99) 9999-999"
										id="txtTelefonoPadre"
										value="#{estudianteDataManager.padreInsertar.perTelefono}"></p:inputMask>
								</td>
								<p:tooltip for="txtTelefonoPadre" value="Ejemplo: (02)2222-222"
									showEffect="slide" hideEffect="slide" showEvent="focus"
									hideEvent="blur" />
							</tr>
							<tr>
								<td class="label"><h:outputLabel 
										value="Titulo" />
								</td>
								<td class="value" colspan="3"><p:inputText 
										style="width: 100%"
										value="#{estudianteDataManager.padreInsertar.perTitulo}" />
								</td>
								<td class="label"><h:outputLabel 
										value="Ocupación" />
								</td>
								<td class="value" colspan="3"><p:inputText 
										style="width: 100%"
										value="#{estudianteDataManager.padreInsertar.perOcupacion}" />
								</td>
							</tr>
														
							<tr>
								<td class="label"><h:outputLabel 
										value="Lugar de Trabajo" />
								</td>
								<td class="value" colspan="3"><p:inputText 
										style="width: 100%"
										value="#{estudianteDataManager.padreInsertar.perDireccionTrabajo}" />
								</td>
							</tr>
							<tr>
								<td class="label"><h:outputLabel for="txtNomPadreEmail"
										value="Email" />
								</td>
								<td class="value" colspan="3"><p:inputText id="txtNomPadreEmail"
										style="width: 100%"
										value="#{estudianteDataManager.padreInsertar.perEmail}" />
								</td>
							</tr>
						</table>
            </p:panel>
        </p:tab>
        <p:tab title="Madre">
           <p:panel id="pnlMadre" header="Información de la Madre">
           					
						<table class="formulario">
						
							<tr>
								<td class="label"><h:outputText for="txtCiMadre"
										value="Cédula"
										 />
								<h:outputLabel value="#{i18n['label.signo.requerido']}" styleClass="item-required" />		 
								</td>
								<td class="value"><p:inputText id="txtCiMadre"
										style="width:100px" onkeypress="return isNumberKey(event);"
										maxlength="10" required="true" requiredMessage="El campo Cédula de la Madre es Obligatorio."
										value="#{estudianteDataManager.madreInsertar.perCi}">
										<f:validator
											validatorId="ec.edu.uce.erp.web.validador.CedulaValidator" />
										<p:ajax event="blur" update="pnlMadre"
											listener="#{estudianteController.buscarMadre}"
											process="@this" />
									</p:inputText></td>
							</tr>

							<tr>
								<td class="label" ><h:outputLabel for="txtApeMadre"
										value="Apellidos" />
								<h:outputLabel value="#{i18n['label.signo.requerido']}" styleClass="item-required" />		
								</td>
								<td class="value" colspan="3"><p:inputText id="txtApeMadre"
										style="width: 100%" required="true" requiredMessage="El campo Apellidos de la Madre es Obligatorio."
										value="#{estudianteDataManager.madreInsertar.perApellidos}" />
								</td>
							</tr>

							<tr>
								<td class="label"><h:outputLabel for="txtNomMadre"
										value="Nombres" />
								<h:outputLabel value="#{i18n['label.signo.requerido']}" styleClass="item-required" />		
								</td>
								<td class="value"><p:inputText id="txtNomMadre"
										style="width: 100%"  required="true" requiredMessage="El campo Nombres de la Madre es Obligatorio."
										value="#{estudianteDataManager.madreInsertar.perNombres}" />
								</td>
							</tr>
							<tr>
								<td class="label"><h:outputLabel for="txtFecNacMadre"
										value="Fecha Nac." /> <h:outputLabel
										value="#{i18n['label.signo.requerido']}"
										styleClass="item-required" /></td>
								<td class="value"><p:calendar pattern="dd/MM/yyyy"
										requiredMessage="El campo Fecha Nacimiento de la Madre es Obligatorio"
										locale="es" id="txtFecNacMadre" style="width: 100%"
										navigator="true"
										value="#{estudianteDataManager.madreInsertar.perFechaNac}"
										showOn="button" required="true" /></td>
							</tr>
							<tr>
								<td class="label"><h:outputLabel for="txtTelefonoMadre"
										value="Teléfono" /></td>
								<td class="value"><p:inputMask mask="(99) 9999-999"
										id="txtTelefonoMadre"
										value="#{estudianteDataManager.madreInsertar.perTelefono}"></p:inputMask>
								</td>
								<p:tooltip for="txtTelefonoMadre" value="Ejemplo: (02)2222-222"
									showEffect="slide" hideEffect="slide" showEvent="focus"
									hideEvent="blur" />
							</tr>
							<tr>
								<td class="label"><h:outputLabel 
										value="Titulo" />
								</td>
								<td class="value" colspan="3"><p:inputText 
										style="width: 100%"
										value="#{estudianteDataManager.madreInsertar.perTitulo}" />
								</td>
								<td class="label"><h:outputLabel 
										value="Ocupación" />
								</td>
								<td class="value" colspan="3"><p:inputText 
										style="width: 100%"
										value="#{estudianteDataManager.madreInsertar.perOcupacion}" />
								</td>
							</tr>
														
							<tr>
								<td class="label"><h:outputLabel 
										value="Lugar de Trabajo" />
								</td>
								<td class="value" colspan="3"><p:inputText 
										style="width: 100%"
										value="#{estudianteDataManager.madreInsertar.perDireccionTrabajo}" />
								</td>
							</tr>
							<tr>
								<td class="label"><h:outputLabel for="txtNomMadreEmail"
										value="Email" />
								</td>
								<td class="value"><p:inputText id="txtNomMadreEmail"
										style="width: 100%"
										value="#{estudianteDataManager.madreInsertar.perEmail}" />
								</td>
							</tr>
							
						</table>
           </p:panel>
        </p:tab>
        <p:tab title="Representante" >
					<p:panel header="Información del Representante" id="pnlRepre" >
						<table class="formulario">

							<tr>
								<td class="label"><h:outputText for="txtCiRepre"
										value="Cédula" />
									<h:outputLabel value="#{i18n['label.signo.requerido']}" styleClass="item-required" />	
								</td>
								<td class="value"><p:inputText id="txtCiRepre" onkeypress="return isNumberKey(event);"
										maxlength="10"	required="true" requiredMessage="El campo Cédula del Representante es Obligatorio."
 										style="width:100px"
										value="#{estudianteDataManager.representanteInsertar.perCi}">
										<f:validator
											validatorId="ec.edu.uce.erp.web.validador.CedulaValidator" />
										<p:ajax event="blur" update="pnlRepre"
											listener="#{estudianteController.buscarRepresentante}"
											process="@this" />
									</p:inputText></td>
							</tr>

							<tr>
								<td class="label"><h:outputLabel for="txtApeRepre"
										value="Apellidos" />
										<h:outputLabel value="#{i18n['label.signo.requerido']}" styleClass="item-required" />
								</td>
								<td class="value"><p:inputText id="txtApeRepre"
										style="width: 100%" required="true" requiredMessage="El campo Apellidos del Representante es Obligatorio."
										value="#{estudianteDataManager.representanteInsertar.perApellidos}" />
								</td>
							</tr>

							<tr>
								<td class="label"><h:outputLabel for="txtNomRepre"
										value="Nombres" />
									<h:outputLabel value="#{i18n['label.signo.requerido']}" styleClass="item-required" />	
								</td>
								<td class="value"><p:inputText id="txtNomRepre"
										style="width: 100%" required="true" requiredMessage="El campo Nombres del Representante es Obligatorio."
										value="#{estudianteDataManager.representanteInsertar.perNombres}" />
								</td>
							</tr>
							
							<tr>
								<td class="label"><h:outputLabel for="txtFecNacRepre"
										value="Fecha Nac." /> <h:outputLabel
										value="#{i18n['label.signo.requerido']}"
										styleClass="item-required" /></td>
								<td class="value"><p:calendar pattern="dd/MM/yyyy" 
										requiredMessage="El campo Fecha Nacimiento del Representante es Obligatorio"
										locale="es" id="txtFecNacRepre" style="width: 100%"
										navigator="true"
										value="#{estudianteDataManager.representanteInsertar.perFechaNac}"
										showOn="button" required="true" /></td>
							</tr>
							<tr>
								<td class="label"><h:outputLabel for="txtTelefonoRepre"
										value="Teléfono" /></td>
								<td class="value"><p:inputMask mask="(99) 9999-999"
										id="txtTelefonoRepre"
										value="#{estudianteDataManager.representanteInsertar.perTelefono}"></p:inputMask>
								</td>
								<p:tooltip for="txtTelefonoRepre" value="Ejemplo: (02)2222-222"
									showEffect="slide" hideEffect="slide" showEvent="focus"
									hideEvent="blur" />
							</tr>
							
							<tr>
								<td class="label"><h:outputLabel 
										value="Titulo" />
								</td>
								<td class="value" colspan="3"><p:inputText 
										style="width: 100%"
										value="#{estudianteDataManager.representanteInsertar.perTitulo}" />
								</td>
								<td class="label"><h:outputLabel 
										value="Ocupación" />
								</td>
								<td class="value" colspan="3"><p:inputText 
										style="width: 100%"
										value="#{estudianteDataManager.representanteInsertar.perOcupacion}" />
								</td>
							</tr>
														
							<tr>
								<td class="label"><h:outputLabel 
										value="Lugar de Trabajo" />
								</td>
								<td class="value" colspan="3"><p:inputText 
										style="width: 100%"
										value="#{estudianteDataManager.representanteInsertar.perDireccionTrabajo}" />
								</td>
							</tr>
							<tr>
								<td class="label"><h:outputLabel for="txtNomRepreEmail"
										value="Email" />
								</td>
								<td class="value"><p:inputText id="txtNomRepreEmail"
										style="width: 100%"
										value="#{estudianteDataManager.representanteInsertar.perEmail}" />
								</td>
							</tr>
						
						</table>
						</p:panel>
						
					</p:tab>
    </p:tabView>
			
				<p:panel id="pnlBotones">
					<p:commandButton id="btnGuardar" value="#{i18n['label.guardar']}"
						actionListener="#{estudianteController.registrarEstudiante}"
						icon="ui-icon-disk"
						process="@this,pnlNuevoEstudiante"
						update="pnlNuevoEstudiante,:formEstudiante:tablaEstudiante" />
					<p:commandButton value="#{i18n['label.cancelar']}"
						actionListener="#{estudianteController.cancel}" process="@this"
						immediate="true" update="pnlNuevoEstudiante"
						icon="ui-icon ui-icon-circle-close" 
						onclick="dlgNuevoEstudiante.hide();"/>
				</p:panel>

			</p:scrollPanel>
		</h:form>
	</p:dialog>
</ui:composition>